<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>任务状态</title>
    <#include "/common/head.html" />
    <link rel="stylesheet" href="${base}/css/taskObtain.css" />
    <link rel="stylesheet" href="${base}/css/mui.picker.min.css" />
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
</head>
<body>
	<!--顶部导航-->
	<div class="topNav clearfix">
		<span class="topNavTxt">发布任务</span>
	</div>
	<!--任务列表-->
	<div class="taskForm">
		<form class="mui-input-group">
			<div class="mui-input-row">
				<label>任务标题</label>
				<input type="text" id="order_title" class="mui-input-clear" placeholder="代取快递">
			</div>
			<div class="mui-input-row">
				<ul class="mui-table-view"> 
			        <li class="mui-table-view-cell mui-collapse taskClassWrap">
			            <a class="mui-navigate-right" href="#">任务类型</a>
                        <#if ordertypes??>
                            <#list ordertypes as type>
                                <#if type_index==0>
                                    <span class="taskClass" data-id="${type.id}">${type.typeName}</span>
                                <#else>
									<span class="taskClass"></span>
                                    <div class="mui-collapse-content">
                                        <p data-id="${type.id}">${type.typeName}</p>
                                    </div>
                                </#if>
                            </#list>
                        </#if>
			        </li>
			    </ul>
			</div>
			<div class="taskDetail">
				<div class="mui-input-row taskDetailTitle">
					<label>任务详情</label>
				</div>
				<div class="mui-input-row">
					<textarea id="order_desc" rows="5" placeholder="多行文本框"></textarea>
				</div>
			</div>
            <#if Session.wx_account??>
              <input type="hidden" id="schoolId" value="${Session.wx_account.schoolId}">
            </#if>
			<div class="mui-input-row">
				<label>任务地址</label>
				<input type="text" class="mui-input-clear" id="re_address" placeholder="东区102教室">
			</div>
			<div class="mui-input-row timeSelectWrap">
				<div>
					<label>任务开始时间</label>
					<input type="text" id='result' class="ui-alert mui-input-clear" placeholder="请选择时间">
				</div>
				<button id='timeBtn' data-options='' class="btn mui-btn mui-btn-block"></button>
			</div>
			<div class="mui-input-row timeSelectWrap">
				<div>
					<label>任务结束时间</label>
					<input type="text" id='resultEnd' class="ui-alert mui-input-clear" placeholder="请选择时间">
				</div>
				<button id="timeEndBtn" data-options='' class="btn mui-btn mui-btn-block"></button>
			</div>
			<div class="mui-input-row">
				<label>联系方式</label>
				<input type="text" class="mui-input-clear" id="tel" placeholder="479384385">
			</div>
			<div class="mui-input-row">
				<label>悬赏金额</label>
				<input type="number" class="mui-input-clear" id="amount" placeholder="￥50">
			</div>
		</form>
		<button type="button" class="taskSubmit mui-btn mui-btn-primary" onclick="sumbit();">付款发布</button>
	</div>
	<!--底部导航-->
    <#include "/common/footer.html" />
    <script type="text/javascript">
        wx.config({

            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。

            appId: '${appId}', // 必填，公众号的唯一标识

            timestamp: '${timestamp}', // 必填，生成签名的时间戳

            nonceStr: '${nonceStr}', // 必填，生成签名的随机串

            signature: '${signature}',// 必填，签名，见附录1

            jsApiList: ['chooseWXPay'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2

        });
    </script>
	<script src="${base}/js/taskObtain.js"></script>
	<script src="${base}/js/mui.picker.min.js"></script>
</body>
</html>
<script>
	(function($) {
				$.init();
				function timeObtain(resultEle,btnEle){
                    var result = $(resultEle)[0];
                    var btns = $(btnEle);
                    btns.each(function(i, btn) {
                        btn.addEventListener('tap', function() {
                            var optionsJson = this.getAttribute('data-options') || '{}';
                            var options = JSON.parse(optionsJson);
                            var id = this.getAttribute('id');
                            var picker = new $.DtPicker(options);
                            picker.show(function(rs) {
                                result.value=rs.text;
                                picker.dispose();
                            });
                        }, false);
                    });
				}
        timeObtain('#result','#timeBtn');
        timeObtain('#resultEnd','#timeEndBtn')
	})(mui);
</script>